import { Text, View } from '@tarojs/components';
import React from 'react';
import './MedicineName.scss'

const MedicineName = ({
  index, item, name, onClick, dotClassName, medicineClass, lastItemStyle, hiddenDot
}) => (
  <View
    key={`${index}`}
    onClick={() => onClick(item)}
    className={`medicine-item${lastItemStyle ? ` ${lastItemStyle}` : ''}`}
  >
    <View className="dot-container">
      {hiddenDot ? null : <View className={`dot${dotClassName ? ` ${dotClassName}` : ` ${dotClassName}`}`} />}
    </View>
    <Text className={`medicine-name${medicineClass ? ` ${medicineClass}` : ''}`}>{name}</Text>
  </View>
)

export default MedicineName
